<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片列表</title>
    <style type="text/css">
        .pic_list_con{
            width: 958px;
            border: 1px solid #666;
            margin: 50px auto 0;
        }
        .pic_list_title{
            width: 918px;
            height: 50px;
            border-bottom: 1px solid #666666;
            /* background-color: gold; */
            text-align: center;
            margin: 0px auto 0;
        }
        .pic_list_title h3{
            float: left; 
            font-family: "Microsoft Yahei";
            margin: 0px;
            line-height: 48px;
            padding: 0 10px ;
            border-bottom: 2px solid red;
            
        }
        .pic_list{
            list-style: none;
            padding: 0px;
            /* background-color: gold; */
            width: 950px;
            margin:0;
            /* overflow: hidden; */
        }
        .pic_list li{
            width: 160px;
            height: 68px;
            float: left;
            margin: 0px 29px 25px 0;
        }
        .pic_list_wrap{
            width: 918px;
            margin: 20px auto 13px; 
            overflow: hidden;
            /* background-color: cyan; */
        }


    </style>
</head>
<body>
    <div class="pic_list_con">
        <div class="pic_list_title">
            <h3>图片展示</h3>
        </div>
        <div class="pic_list_wrap">
            <ul class="pic_list">
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            <li><a href="#"><img src="./images/goods.jpg" alt="商品图片"></a></li>
            </ul>
        </div>
    </div>

</body>
</html>